import { rgb } from 'geotiff'
import React, { useEffect, useState } from 'react'
import { Table ,Button} from 'antd';
import { CloseOutlined } from '@ant-design/icons';
import { fromCircle } from 'ol/geom/Polygon';

import { resourcePath } from '../../../../../../../utils/resource';
import CztApi from '../../../../../../../utils/apis/CztApi';


export default function Xq(props) {
    const {onName}=props;
    const [xq,xqset] = useState();
    const [data,setData] = useState()
    
    const handleClick=(record)=>{
        console.log('record',record)
        onName(record)
    }
   
    const {datas1,datas2,datas3}=props;
     const columns = [
        {
          title: datas3===1?'承灾体名称':'减灾资源',
          dataIndex: 'title',
          
        },
    {
        width:80,
        render:(text,record)=>{
            return <Button size='small' type='link' onClick={()=>{
                handleClick(record)
            }}>详情</Button>

        }
    } ];
     
    useEffect(()=>{
       // datas3取值1，2。1：影响范围。2：救援保障。现接口获取回的数据仅名称。
        const {datas3}=props;
        if(datas3===1){
        CztApi.cztxq(datas1,fromCircle(datas2)).then(resp=>{
            setData(resp.data);
        })}else{
            CztApi.jzzyxq(datas1,fromCircle(datas2)).then(resp=>{
                setData(resp.data);
            })
            
        }
    },[datas1,datas2,datas3,props])



    return props.datas1?(
        <div style={{
            width: 350,
            position: "absolute",
            right: 30,
            top: 30,
            bottom: 30,
            background: 'rgba(1,15,31,0.5)',
            // border: '1px solid rgba(9,107,225,0.8)',
            pointerEvents: 'auto',
            overflow: "auto",
            borderRadius: 8
        }} className="layout-v">
            <div style={{
                fontSize: 20,
                fontWeight: "bold",
                marginBottom: 12
            }} className='layout-h center'>
                <div className='fill w0'>
                    <div style={{
                        background: `url(${resourcePath.blockTitleBg})`,
                        height: 36,
                        backgroundSize: '100% 100%',
                        fontSize: 18,
                        lineHeight: '36px',
                        paddingLeft: 12,
                        fontWeight: "bold",
                        overflow: "hidden"
                    }} title={"qqqqqqqqqqqqqqqqqqqqqqqqqqq"}>
                                {/* 这里标题 */}
                                {props.datas1}
                    </div>
                </div>
                <div>
                <Button size="small" icon={<CloseOutlined />} style={{
                        // color: "#fff"
                    }} onClick={e => {
                        props.onClose?.()
                    }} />
                </div>
            </div>
            <Table style={{margin:10}}
                // rowSelection={{
                //     type: selectionType,
                //     ...rowSelection,
                // }}
                columns={columns}
                dataSource={data}
            />
        </div>
    ):null
}
